import Vue from 'vue'
import VueRouter from 'vue-router'
import '../assets/css/header.css'
import '../assets/css/reset.css'
import Shop from '../views/shop.vue'
import Item from '../views/item.vue'
import Cart from '../views/cart.vue'
import CheckOut from '../views/checkout.vue'
import Payment from '../views/payment.vue'
import Account from '../views/account.vue'
import Order from '../views/account/order.vue'
import Address from '../views/account/address.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: "shop",
    component: Shop
  },
  {
    path: '/item',
    name: "item",
    component: Item
  },
  {
    path: '/cart',
    name: "Cart",
    component: Cart
  },
  {
    path: '/checkout',
    name: "CheckOut",
    component: CheckOut
  },
  {
    path: '/payment',
    name: "Payment",
    component: Payment
  },
  {
    path: '/account',
    component: Account,
    children: [
      {
        path: '',
        name: "Account",
        component: Order
      },
      {
        path: '/address',
        name: 'Address',
        component: Address
      }
    ]
  }
]

const router = new VueRouter({
  routes,
  mode: "history"
})

export default router
